<template>
  <span v-if="props.price > 0" class="price">
    ￥{{ props.price }} <span v-if="props.price < props.linePrice" class="price-line">￥{{ props.linePrice }}</span>
  </span>
  <span v-else class="free-price">免费</span>
</template>
<script setup>
  const props = defineProps({
    price: { type: Number, default: 0 },
    linePrice: { type: Number, default: 0 }
  })
</script>
<style lang="scss" scoped>
  .free-price {
    font-size: 16px;
    color: green;
  }
  .price {
    font-size: 16px;
    color: red;
  }
  .price-line {
    font-size: 12px;
    color: red;
    text-decoration-line: line-through;
  }
</style>
